Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor and test cache #2220

Merged
merged 8 commits into from
Jun 14, 2024
Merged

Refactor and test cache #2220

merged 8 commits into from
Jun 14, 2024

Conversation

frandiox
Copy link
Contributor

@frandiox frandiox commented Jun 7, 2024

This PR should be checked commit by commit:

  1. Extract fetchWithServerCache in a different file.
  2. Move createWithCache from root to cache dir.
  3. Add tests for createWithCache.
  4. Fix rounding issue.
  5. Update examples to show data validation

@frandiox frandiox requested review from blittle and a team June 7, 2024 08:05
Copy link
Contributor

shopify bot commented Jun 7, 2024

Oxygen deployed a preview of your fd-cache-tests branch. Details:

Storefront Status Preview link Deployment details Last update (UTC)
Skeleton (skeleton.hydrogen.shop) ✅ Successful (Logs) Preview deployment Inspect deployment June 7, 2024 9:19 AM

Learn more about Hydrogen's GitHub integration.

This comment has been minimized.

@@ -135,7 +131,7 @@ async function setItem(
// cache-control is still necessary for mini-oxygen
response.headers.set('cache-control', paddedCacheControlString);
response.headers.set('real-cache-control', cacheControlString);
response.headers.set('cache-put-date', new Date().toUTCString());
response.headers.set('cache-put-date', String(Date.now()));
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@wizardlyhel Do you remember why this was using toUTCString? It introduces a rounding error (~500ms as mentioned in the note above. Instead, .toISOString() could fix the error but we can also just use the timestamp directly I think?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

urk ... rounding error of ~500ms .. that sucks and how the hell you figure that out?!

I think I was thinking to make the SWR cache calculation to not have timezone differences and this is heavily depends on how the workers and cache data centres are distributed. So .. if we have

  • worker 1 in UTC + 7
  • worker 2 in UTC + 6

and data centre is at UTC + 7 and both workers are accessing the same data centre, then setting a cache entry on the same key would produce different cache entry duration calculation if they use their local server timestamp

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I understand the reasoning about the different timezone with toUTCString but that function does not return milliseconds so it's impossible to parse it into something accurate (half second rounding error). On the other hand, toISOString contains milliseconds:

  • toUTCString: Mon, 10 Jun 2024 02:03:08 GMT
  • toISOString: 2024-06-10T02:03:08.920Z

They are both always based on UTC.

In any case, I think a simple timestamp based on UTC is also fine and even simpler, right?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh! I didn't know that UTCString doesn't supply the milliseconds. Yea, let's use ISOString

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But Date.now() also considers UTC and is simpler conceptually to store milliseconds than a date. Let's use that better, no?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Agreed, I think Date.now() is simpler

const VALUE = 'my-value';
const actionFn = vi.fn(() => VALUE);
const waitUntil = vi.fn(() => {});
let cache: InMemoryCache;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For now this test uses our InMemoryCache implementation. We could change this to eventually use real MiniOxygen cache directly but I think it's good for now.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is awesome! Thank you for doing this. One nitpicky thing, but maybe an extra test that just validates cache expiration?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's already one in this file, inside the SWR test. It first checks SWR, then it checks what happens when the whole thing expires 👍

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The only change to this code is renaming a couple of private types. Everything else is extracted from src/cache/fetch.ts

@frandiox frandiox merged commit dcbd0bb into main Jun 14, 2024
13 checks passed
@frandiox frandiox deleted the fd-cache-tests branch June 14, 2024 04:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants